<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<link rel="stylesheet" href="./css/base.css">
	<link rel="stylesheet" href="./css/hot.css">
	<title>榜单</title>
	<link rel="icon" href="./img/favicon.ico">
</head>
<body>
	<div id="logincover">
		<div class="login-inter">
			<img src="./img/关闭.png" id="clo">
			<a href="login.html">去注册</a>
			<div class="row">
				<div class="cur" id="col">短信登录</div>
				<div id="col">密码登陆</div>
				<div id="col">SIM登录</div>
			</div>
			<div id="hint">
				<img src="./img/err.png" >
				<img src="img/ok.png" >
				<span>手机号格式不正确</span>
				<span>手机号可用</span>
			</div>
			<div id="phon">
			<input placeholder="手机号">
			<div class="row">
				<div class="col-7">
					<input placeholder="请输入验证码"/>
				</div>
				<div class="col-5">
					<p>获取验证码</p>
				</div>
			</div>
			<p>登录</p>
			</div>
			<div id="pwd">
				<input placeholder="手机号/邮箱/用户名">
				<input placeholder="密码">
				<div id="sign">
						<div class="col">
							<input type="checkbox"/>
							<span>自动登录</span>
						</div>
						<div class="col">
							<span>忘记密码</span>
							<span>|</span>
							<a href="login.html">注册</a>
						</div>
				</div>
				<div id="tisi">
				<img src="./img/err.png" >
				<img src="img/ok.png" >
				<span>密码长度在5~12位</span>
				<span>密码长度符合</span>
				</div>
				<p>登录</p>
				<span>手机号或密码不正确</span>
			</div>
			<div id="SIM">
				<input placeholder="手机号">
				<p>登录</p>
				<span>温馨提示：</span>
				<span>1.“SIM登录” 是由中国移动提供的PC端安全登录服务</span>
				<span>2.输入手机号点击 “登录”，即可在手机上查看登录请求，并使用手机进行登录授权</span>
			</div>
			<div class="text">
				登录即同意<span>《咪咕用户服务协议》</span>
				和<span>《咪咕隐私权政策》</span>
			</div>
		</div>
	</div>
	<!-- 一楼 -->
	<div class="container-fluid">
	<div class="f1">
		<div class="container">
			<div class="row">
				<div class="col-1">
					<img src="./img/210928004729927_188x50_4237.png" >
				</div>
				<div class="col-7">
					<ul>
						<li><a href="#">音乐</a></li>
						<li><a href="#">现场</a></li>
						<li><a href="vip.html">
						<img src="./img/皇冠.png" >
						会员中心</a></li>
						<li><a href="fanxiang.html">凡响计划</a></li>
						<li><a href="#">客户端下载</a></li>
					</ul>
				</div>
				<div class="col-4">
					<input placeholder="搜索歌曲、歌手、MV">
					<img src="./img/206搜索-线性.png" >
					<div>
					<img src="./img/no-login.png">
					<div class="log_popup">
						<p><span>一</span>登录后可专享<span>一</span></p>
						<div class="row">
							<div class="col-4">
								<img src="./img/乐谱编辑.png">
								<p>试听记录同步</p>
							</div>
							<div class="col-4">
								<img src="./img/彩铃.png">
								<p>订购酷炫铃音</p>
							</div>
							<div class="col-4">
								<img src="./img/无损音质.png">
								<p>下载无损音乐</p>
							</div>
						</div>
						<div class="row">
							<div class="col-6">
								<span class="lgin">登陆</span>
								</div>
							<div class="col-6">
								<span><a href="login.html">注册</a></span>
								</div>
						</div>
					</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- 二楼 -->
	<div class="f2">
		<div class="container">
			<ul class="cur">
				<li><a href="homepage.html">首页</a></li>
				<li><a href="playlist.html">歌单</a></li>
				<li><a href="special-issue.html">专辑</a></li>
				<li><a href="#">榜单</a></li>
				<li><a href="singer.html">歌手</a></li>
				<li><a href="crbt.html">彩铃</a></li>
				<li><a href="hardware.html">咪咕周边</a></li>
			</ul>
			<ul>
				<li><a href="#">首页</a></li>
				<li><a href="#">演唱会</a></li>
				<li><a href="#">独家放送</a></li>
				<li><a href="#">MV</a></li>
			</ul>
		</div>
	</div>
	</div>
	<!-- 三楼 -->
	<div class="f3">
		<div class="container">
			<div class="left">
				<div class="row">
					<ul>
						<li>
							<p><span>咪咕尖叫榜</span><img src="./img/向下箭头.png" ></p>
							<ul>
								<li>尖叫新歌榜</li>
								<li>尖叫热歌榜</li>
								<li>尖叫原创榜</li>
							</ul>
						</li>
						<li>
							<p><span>咪咕特色榜</span><img src="./img/向下箭头.png" ></p>
							<ul>
								<li>影视榜</li>
								<li>内地榜</li>
								<li>港台榜</li>
								<li>欧美榜</li>
								<li>日韩榜</li>
								<li>彩铃榜</li>
								<li>KTV榜</li>
								<li>网络榜</li>
								<li>新歌专辑榜</li>
								<li>MV榜</li>
							</ul>
							</li>
						<li>
							<p><span>全球权威榜</span><img src="./img/向下箭头.png" ></p>
							<ul>
								<li>美国iTunes榜</li>
								<li>美国billboard榜</li>
								<li>Hito中文榜</li>
								<li>韩国Melon榜</li>
								<li>英国UK榜</li>
							</ul>
							</li>
						<li>
							<p><span>咪咕乐·榜</span><img src="./img/向下箭头.png" ></p>
							<ul>
								<li>2022</li>
								<li>2021</li>
								<li>2020</li>
								<li>2019</li>
								<li>2018</li>
							</ul>
							</li>
					</ul>
				</div>
			</div>
			<div class="right">
				<div class="row">
					<div class="col">
						<img src="./img/1643454276(1).png" >
					</div>
					<div class="col">
						<h1>尖叫新歌榜</h1>
						<p>每小时跟新</p>
						<div class="play-back">
						<div class="play">
							<img src="img/24gl-play.png">
							<span>播放选中歌曲</span>
						</div>
						<div class="add">
							<img src="./img/add-folder.png" >
							<span>添加到</span>
						</div>
						</div>
					</div>
				</div>
				<div class="row-list">
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
						</div>
						<div class="col-6">歌曲</div>
						<div class="col-5">时长</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">01</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/ASdb67e391ce95833a8ebf1d8d119929e2.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>年轻人（电影《狙击手》致敬曲）</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>05:15</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">02</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/AS404ad3de20810328db18c3af89a912ca.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>男二号</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>04:50</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">03</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/AS66a396a4b684b09cdae58974147414cd.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>弦丝万缕</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>03:37</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">04</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/AS3459c4e76dcc010ebb5643d42371997f.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>留香</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>04:7</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">05</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/AS3b89097152a3bc4743ea0aad7dcbb8c6.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>万事如意（《时光音乐会》第14期）</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>04:07</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">06</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/AS3b89097152a3bc4743ea0aad7dcbb8c6.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>爱就一个字（《时光音乐会》第14期）</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>04:36</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">07</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/AS7171690a2c76d122d398dcbf46bc2ba0.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>雪花（电影《长津湖之水门桥》主题曲）</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>03:19</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">08</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/AS56dcba0ac457df39b5bd216a3ac3ed02.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>窗前明月光</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>03:36</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">09</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="img/AS445c628d840e23ecc4d2544789bcd5ae.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>你逆着光而来（电视剧《假日暖洋洋》主题曲）</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>03:18</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">10</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/AS9df20904044a05ea8100b6ee2d0e7f21.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>如梦</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>04:41</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">11</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/ASa348858f22faf7525a6b7ac0df8419fa.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>出场</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>04:25</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">12</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/AS025190803d8d9ac1c4ef1700be0db7d5.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>倚天屠龙（电影《倚天屠龙记》推广曲）</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>05:16</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">13</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/AS98fb71c8597dc91e8f15e8eccc28921f.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>纸飞机（Fly away）（男声国语钢琴版）</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>03:58</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">14</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/AS47fa1acea19dc12336ee2c52f57dcd8b.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>人生海海（live）</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>04:33</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">15</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/ASf9565e46cf0baedd98bc3e8b1aac5c3f.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>DlSCO</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>03:55</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">16</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/AS31726477e816d4bfd9d6807fa6b12f4e.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>人间团圆</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>04:01</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">17</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/ASb384f4156933dc2d7a2f57725c5f486e.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>爱拼才会赢（闽南语）</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>03:32</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">18</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/AS47fa1acea19dc12336ee2c52f57dcd8b%20(1).jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>终结孤单（live）</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>04:15</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">19</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/AS4521e4c5df08734b68f10b9fc7604f19.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>独白</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>04:47</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">20</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/ASab075e3aba7267525a4718d558df66c4.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>梦想开怀</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>03:48</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">21</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/ASdb67e391ce95833a8ebf1d8d119929e2.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>年轻人（电影《狙击手》致敬曲）</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>05:15</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">22</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/AS9a2e66af48ad53dcc4028667417aaea3.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>Big Girl</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>05:15</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">23</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/AS1ce169e326bae19f9b64738d13ad412e.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>变成你身边的微风</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>05:15</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">24</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/ASc578db1e1598b9af49076fb21da14c6d.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>Running Back</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>05:15</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">25</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/ASf1871a73b99488067ccf6690094de206.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>因为你(电影《青春换日线》主题曲)04:50</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>05:15</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">26</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/ASfd329517d420ecd97a043ddaa7e5f8f7.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>REACH THE SKY (中文)</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>05:15</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">27</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/ASb0a913d9776a096ed117bba578cec58b.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>Breakfast in the Bed</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>05:15</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="row">
						<div class="col-1">
							<input type="checkbox">
							<span class="tit">28</span>
							<img class="img" src="./img/24gl-play1.png">
							<img class="img-hover" src="./img/播放2.png">
						</div>
						<div class="col-6">
							<div class="play">
							<img src="./img/AS4facab2f158a58c54dd4f7423874f003.jpg" >
							<div class="img-cover">
								<img src="./img/btn-play.png" >
							</div>
							</div>
							<span>卸妆</span>
							<div class="vip">vip</div>
							<div class="bit-con">
								24
								<div class="bit">bit</div>
							</div>
						</div>
						<div class="col-2">
							<span>05:15</span>
						</div>
						<div class="col-3">
							<img src="./img/铃铛.png">
							<img src="./img/下载.png">
							<img src="./img/添加到.png">
							<img src="./img/分享.png">
						</div>
					</div>
					<div class="a-page">
						<span>
							<img src="img/向左箭头.png" >
						</span>
						<span>1</span>
						<span>2</span>
						<span>
							<img src="img/向右箭头.png" >
						</span>
					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- 四楼 -->
	<div class="f4">
		<div class="container">
			<div class="row">
				<div class="col-9">
					<div class="row">
						<div class="col-4">
							<ul>
								<li><a href="#">咪咕文化</a></li>
								<li><a href="#">咪咕文化官网</a></li>
								<li><a href="#">咪咕音乐简介</a></li>
								<li><a href="#">服务协议</a></li>
								<li><a href="#">隐私权政策</a></li>
							</ul>
						</div>
						<div class="col-4">
							<ul>
								<li><a href="#">咪咕音乐家族</a></li>
								<li><a href="#">圈子彩铃</a></li>
							</ul>
						</div>
						<div class="col-4">
							<ul>
								<li><a href="#">联系我们</a></li>
								<li><a href="#">业务合作</a></li>
								<li><a href="#">常见问题</a></li>
							</ul>
						</div>
					</div>
					<p><img src="./img/201012095135561_48x48_9661.png" ></p>
				</div>
				<div class="col-3">
						<p>咪咕客户端</p>
					<div class="row">
						<div class="col-6">
							<img src="./img/20101209435723_300x300_1190.png">
							<span>咪咕音乐</span>
						</div>
						<div class="col-6">
							<img src="./img/201012094413724_300x300_8080.png" >
							<span>咪咕视频</span>
						</div>
					</div>
				</div>
			</div>
			<div class="ending">
					<p>蜀ICP备15012512号</p><p>川网文[2019]2118-124</p><p>网络视听许可证0112648号</p><p>增值业务许可证A2.B1.B2-20100001</p><p>川公网安备 51010702002209号</p>
					<p>Copyright © 2005 - 2022 咪咕音乐有限公司</p>
				</div>	
		</div>
	</div>
	<script src="jquery-3.6.0.js"></script>
	<script>
	const p=document.querySelectorAll('.f3 li>p')
	p.forEach(value=>{
		value.onclick=function(){
			$(this).next().toggle('stop(true).show(300)')
			this.classList.toggle('cur')
		}
	})
	$('.container-fluid').on('mouseover','a',function(){
			if($(this).text()=='现场'){
				$('.f2 ul:last-child').prop('class','cur').siblings().prop('class','')
			}
			if($(this).text()=='音乐'){
				$('.f2 ul:first-child').prop('class','cur').siblings().prop('class','')
			}
		})
		$('.container-fluid').mouseleave(function(){
				$('.f2 ul:first-child').prop('class','cur').siblings().prop('class','')
		})
		// 登陆
		$('.f1 .container>.row>.col-4>div').mouseover(function(){
			$('.f1 .log_popup').stop(true).show(300)
		})
		$('.f1 .container>.row>.col-4>div').mouseleave(function(){
			$('.f1 .log_popup').stop(true).hide(300)
		})
		const lgin=document.querySelector('.lgin')
		lgin.onclick=()=>{
				logincover.style=`display: flex;`
			}
			clo.onclick=()=>{
				logincover.style=`display: none;`
			}
			$('.login-inter>div>input:first-child').on('input',function(){
					if($(this).val()==''){
						$('#hint').prop('class','')
						return
					}
				if(/^1[3-9]\d{9}$/.test($(this).val())){
					$('#hint').prop('class','ok')
				}else{
					$('#hint').prop('class','err')
				}
			})
			$('.login-inter>div>input:first-child').blur(function(){
				$('#hint').prop('class','')
			})
			$('#pwd>input:nth-of-type(2)').on('input',function(){
				const l=$(this).val()
				if(l==''){
					$('#tisi').prop('class','')
					return
				}
				if(l.length>12 || l.length<5){
					$('#tisi').prop('class','err')
				}else{
					$('#tisi').prop('class','ok')
				}
			})
			$('#pwd>input:nth-of-type(2)').blur(function(){
				$('#tisi').prop('class','')
			})
			// $('#pwd>p').click(function(){
			// 	let p=$('#pwd>input:first-child').val()
			// 	let w=$('#pwd>input:nth-of-type(2)').val()
			// 	let xhr=new XMLHttpRequest()
			// 	xhr.open('get','/v1/log/lg?phone='+p+'&pwd='+w)
			// 	xhr.send()
			// 	xhr.onload=()=>{
			// 		console.log(xhr.responseText)
			// 		if(xhr.responseText=='err'){
			// 			$('#pwd>span').prop('class','err')
			// 		}
			// 	}
			// })
			$('.login-inter>.row').on('click','div',function(){
				$(this).addClass('cur').siblings().removeClass('cur')
				if($(this).text()=='短信登录'){
					phon.style.display=''
					pwd.style.display='none'
					SIM.style.display='none'
				}
				if($(this).text()=='密码登陆'){
					phon.style.display='none'
					pwd.style.display='block'
					SIM.style.display='none'
				}
				if($(this).text()=='SIM登录'){
					phon.style.display='none'
					pwd.style.display='none'
					SIM.style.display='block'
				}
			})
	</script>
</body>
</html>
